<template>
  <div class="wrap">
    <div class="bf">
      <div class="img df" v-if="!useInfo.avator">
        <open-data type="userAvatarUrl"></open-data>
      </div>
      <div class="img df" v-if="useInfo.avator">
        <img :src="baseUrl + 'resource/' + useInfo.avator + '?imageView/2/w/150/h/150'" alt="">
      </div>
      <div class="tc fs30 mb20">{{useInfo.name}}</div>
      <div class="modify tc"><span class="mainBgColor" @click="modifyPassword"><van-icon class="icon icon1 mainColor" name="edit" />修改密码</span></div>
    </div>
    <div class="org df jsb fs28"><span class="df aic "><van-icon class="icon" name="cluster-o" />组织机构</span><span>{{org_name}}</span></div>
    <div class="btn tc"><button class="mainBgColor" size="mini" @click="logOut">退出登陆</button></div>
  </div>
</template>

<script>
import setting from '@/setting'
export default {
  components: {
  },

  data () {
    return {
      useInfo: {},
      baseUrl: '',
      org_name: ''
    }
  },
  methods: {
    logOut () {
      wx.showModal({
        title: '提示',
        content: '确定退出登陆？',
        success (res) {
          if (res.confirm) {
            wx.removeStorageSync('useInfo')
            wx.removeStorageSync('dics')
            wx.reLaunch({
              url: '../login/main'
            })
          }
        }
      })
    },
    modifyPassword () {
      const url = '../modifyPassword/main'
      wx.navigateTo({url})
    }
  },
  mounted () {
    this.baseUrl = setting.baseUrl
    let result = wx.getStorageSync('useInfo')
    this.useInfo = result
    this.org_name = result.orgList[0].name
  }
}
</script>

<style scoped>
  .bf{background: #fff;padding: 30rpx 0;margin-bottom: 20rpx;}
  .org{background: #fff;padding: 20rpx 30rpx;}
  .img{width: 150rpx;height: 150rpx;border-radius: 50%;overflow: hidden;margin: 0 auto;margin-bottom: 30rpx;border: 2rpx solid #eee;}
  .img img{width: 100%;height: 100%;border-radius: 50%;}
  .btn{margin-top: 50rpx;position: fixed;bottom: 100rpx;left: 50%;transform: translateX(-50%);width: 90%;}
  .btn button{width: 100%;color: #fff;padding: 10rpx 0;}
  .item{margin: 20rpx 0;color: #444}
  .arrow{color: #444;margin-top: 10rpx;}
  .mb20{margin-bottom: 20rpx;}
  .wrap{background: #eee;height: 100vh;overflow: hidden;}
  .icon{margin-top: 10rpx;margin-right: 10rpx;color: #2f74ff !important}
  .icon1{color: #fff !important}
  .modify span{color: #fff;font-size: 26rpx;padding: 10rpx;border-radius: 10rpx;}
</style>
